<template>
  <view>
    <up-tabbar
      :value="tabbarValue"
      @change="tabbarChange"
      :fixed="true"
      :placeholder="false"
      activeColor="#d81e06"
      :safeAreaInsetBottom="false"
    >
      <up-tabbar-item text="购物" icon="home" @click="click1"></up-tabbar-item>
      <up-tabbar-item text="美团" icon="photo" @click="click1"></up-tabbar-item>
      <up-tabbar-item
        text="饿了么"
        icon="play-right"
        @click="click1"
      ></up-tabbar-item>
      <up-tabbar-item
        text="我的"
        icon="account"
        @click="click1"
      ></up-tabbar-item>
    </up-tabbar>
  </view>
</template>

<script setup>
import { ref, onMounted } from "vue";

// 定义组件属性
const props = defineProps({
  // title: {
  //   type: String,
  //   default: "标题",
  // },
  // leftIconSize: {
  //   type: Number,
  //   default: 20,
  // },
});
const tabbarValue = ref(0);
const tabbarChange = (e) => {
  console.log(e);
};
</script>

<style lang="scss" scoped></style>
